<template>
	<view class="wp">
		<!-- <view class="s_input s_tip">现有2000套</view> -->
		<view class="s_input" style="margin-top: 20rpx;">
			<label for="">会员ID：</label>
			<input type="number" v-model="mid" placeholder="请输入会员ID">
			<view class="s_query" @click="queryMember">查询</view>
		</view>
		<view class="query_result" v-show="member.member.nickname">
			<view class="q_tit">查询结果如下</view>
			<view class="q_content" style="margin-top: 20rpx;">
				<!-- <image src="/static/wx.png"></image> -->
				<image :src="member.member.avatar"></image>
				<view class="q_info">
					<view>姓名：{{member.member.nickname}}</view>
					<view>电话：{{member.member.mobile}}</view>
					<view>现有店铺：{{member.member.supnum||0}}</view>
					<view>现有团长：{{member.member.rfernum||0}}</view>
				</view>
			</view>
		</view>
		<view class="s_input" style="margin-top: 20rpx;" v-show="member.member.nickname">
			<label for="">划拨店铺：</label>
			<input type="number" v-model="supnum" @input="changeInput" placeholder="请输入数量">
		</view>
		<view class="s_input" style="margin-top: 20rpx;" v-show="member.member.nickname">
			<label for="">划拨团长：</label>
			<input type="number" v-model="refernum" @input="changeInput2" placeholder="请输入数量">
		</view>
		<view class="s_href" @click="$navTo('/pages/user/transferList')">划拨明细></view>
		<view class="totalBtn" @click="submit">确认划拨</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				mid: '',
				member: [],
				supnum: '',
				refernum:''
			}
		},
		methods: {
			// 只能输入整数
			changeInput(e){
				let value = e.detail.value;
				if (value.indexOf('.')!=-1) {
				    value = value.substring(0, value.length - 1)
				}
				this.$nextTick(function() {
					this.supnum = value;
				})
			},
			// 只能输入整数
			changeInput2(e){
				let value = e.detail.value;
				if (value.indexOf('.')!=-1) {
				    value = value.substring(0, value.length - 1)
				}
				this.$nextTick(function() {
					this.refernum = value;
				})
			},
			queryMember(){
				if(!this.mid) return this.$api.msg('请输入会员ID');
				this.member = [];
				this.$axios('salecenter/searchSC','POST','member',{
					mid: this.mid
				}).then(res=>{
					if(res.data.code == 200){
						this.member = res.data.data;
					}
				})
			},
			submit(){
				if(this.member.member.nickname){
					if(!this.supnum) return this.$api.msg('请输入店铺数量');
					uni.showModal({
						title: '提示',
						content: '确认要划拨吗？',
						success: res=> {
							if (res.confirm) {
								this.$axios('salecenter/submitSC','POST','member',{
									mid: this.mid,
									supnum: this.supnum,
									refernum: this.refernum
								}).then(res=>{
									if(res.data.code == 200){
										this.$api.msg(res.data.data);
									}
								})
							}
						}
					});
				}else{
					return this.$api.msg('请先查询');
				}
			}
		}
	}
</script>

<style lang="scss">
	page{
		background: #FBF8FE;
	}
	.wp{
		padding: 20rpx;
		padding-bottom: 100rpx;
	}
	.s_input{
		background: #FFFFFF;
		border-radius: 12rpx;
		display: flex;
		justify-content: space-between;
		height: 120rpx;
		align-items: center;
		padding: 0 30rpx;
		input{
			flex: 1;
		}
		.s_query{
			width: 104rpx;
			line-height: 54rpx;
			background: #8615E1;
			border-radius: 27rpx;
			color: #FFFFFF;
			font-weight: 600;
			text-align: center;
		}
	}
	.query_result{
		.q_tit{
			text-align: center;
			color: #999999;
			line-height: 100rpx;
		}
		.q_content{
			padding: 10rpx 30rpx;
			background: #FFFFFF;
			border-radius: 12rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			.q_info{
				flex: 1;
				line-height: 50rpx;
			}
			image{
				width: 120rpx;
				height: 120rpx;
				margin-right: 20rpx;
				border-radius: 50%;
			}	
		}
	}
	.s_tip{
		margin-bottom: 20rpx;
		font-size: 30rpx;
		font-weight: 600;
		color: #8615E1;
		justify-content: center;
		height: 80rpx;
	}
	.s_href{
		color: #8615E1;
	    font-size: 30rpx;
	    font-weight: 600;
		text-align: right;
	    margin-top: 30rpx;
	}
</style>
